//顶部导航
//##
//
.site-navbar {
  border-bottom: none;
  min-width: 960px;
  @include box-shadow(0 2px 4px rgba(0, 0, 0, .08));
  .navbar-header {
    width: $navbar-header-width;
    height: $navbar-height;

    text-align: center;
    line-height: $navbar-height;

    background: $brand-primary;

    transition: width 300ms;

    .logo {
      width: 200px;
      font-size: 18px;
      color: #fff;
    }
    .logo-sm {
      display: none;
      width: 48px;
    }
  }
  .navbar-container {
    margin-left: $navbar-header-width;
    padding-left: $navbar-padding-horizontal;
    padding-right: $navbar-padding-horizontal;
  }
  .nav-icon {
    margin-right: 10px;
    vertical-align: middle;
  }
  .manager {
    &.open {
      background: #F8FAFB;
    }
    > .dropdown-menu {
      min-width: 180px;
      font-size: 12px;
      margin-top: 3px;
      > li {
        padding: 6px 7px;

        > a {
          padding-right: 15px;
          color: #76838f;

          &:hover {
            background-color: #F2F7F9;
          }
        }
      }
      > li.divider {
        padding: 0;
      }
      .nav-icon {
        margin-right: 10px;
      }
    }
  }
  .message {
    > .dropdown-menu {
      width: 420px;
      margin-top: 3px;
      border-radius: 3px;
    }

    .message-icon {
      display: inline-block;
      position: relative;
      .remind{
        content: '';
        position: absolute;
        right: 5px;
        top: -5px;
        height: 10px;
        width: 10px;
        border-radius: 10px;
        background: $brand-danger;
      }
    }
  }

  .message-header {
    padding: 15px;
    border-bottom: 1px solid $brand-default;
    font-size: 16px;
  }
  .message-content {
    ul {
      list-style: none;
      padding: 0;
      > li {
        padding-left: 15px;
        padding-right: 15px;
        > .message-container {
          border-bottom: 1px solid $brand-default;
          cursor: pointer;
        }
        .message-title {
          position: relative;
          display: inline-block;
          width: 70%;
          padding-left: 20px;
          line-height: 30px;
          &:before {
            content: '';
            position: absolute;
            height: 10px;
            width: 10px;
            left: 0;
            top: 10px;
            border-radius: 10px;
            background: $brand-danger;
          }
        }
        .message-date {
          display: inline-block;
          width: 20%;
          text-align: right;
          color: #b3b3b3;
        }
        .message-check {
          display: none;
          width: 20%;
          text-align: right;
          color: #b3b3b3;
        }

        .message-except {
          padding-left: 20px;
          margin-bottom: 20px;
          color: #b3b3b3;
          font-size: 12px;
        }

        &:hover {
          background: #f2f2f2;
          .message-check {
            display: inline-block;
          }
          .message-date {
            display: none;
          }
        }
      }

      >li.empty{
        height: 60px;
        line-height: 60px;
        text-align: center;
        border-bottom: 1px solid $brand-default;

        &:hover{
          background: #FFFFFF;
        }
      }
    }
  }

  .message-footer {
    padding: 15px;
    > a {
      color: #b3b3b3;
    }
  }
}

//折叠菜单下的导航条
.menubar-fold .site-navbar {
  .navbar-header {
    width: $navbar-header-width-fold;

    text-align: center;
    transition: width 300ms;
    .logo {
      display: none;
    }
    .logo-sm {
      display: inline-block;
    }
  }
  .navbar-container {
    margin-left: $navbar-header-width-fold;
  }
}

@keyframes rotate360 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
